var searchType=-1;
jQuery("#grid").jqGrid({
	url:"db.php",
	datatype: "json",
	height: 200,
	colNames:['TID','IP','PORT','CODE','HEADER','TIME','CONTENT','SOURCE','TABLE'],
	colModel:[
	{name:'TID',index:'TID', width:10,hidden:true},
	{name:'IP',index:'IP', width:100},
	{name:'PORT',index:'PORT', width:75},
	{name:'CODE',index:'CODE', width:75},
	{name:'HEADER',index:'HEADER', width:100},
	{name:'TIME',index:'TIME', width:100,hidden:false},
	{name:'CONTENT',index:'CONTENT', width:150},
	{name:'SOURCE',index:'SOURCE', width:150},
	{name:'TABLE',index:'TABLE', width:10,hidden:true}
	],
	width:800,
	rowNum:20,
	rowList:[10,20,30],
	mtype: "POST",
	pager: jQuery('#pgrid'),
	sortname: 'TID',
	viewrecords: true,
	sortorder: "desc",
	viewrecords: true,
	grouping:true, 
	gridComplete: function(){
		var ids = jQuery("#grid").jqGrid('getDataIDs');
		for(var i=0;i < ids.length;i++){
			var cl = ids[i];
			ae = "<input style='height:22px;width:150px;' type='button' onclick=\"showContent(+"+cl+")\" value='Show Content'/>"; 
			be = "<input style='height:22px;width:150px;' type='button' onclick=\"showSource(+"+cl+")\" value='Show HTML Source'/>";
			jQuery("#grid").jqGrid('setRowData',ids[i],{CONTENT:ae,SOURCE:be});
		}	
	},
	onSelectRow: function(ids) { 
		var id = jQuery("#grid").jqGrid('getGridParam','selrow'); 
		if (id) { 
			var ret = jQuery("#grid").jqGrid('getRowData',id);
		} 
		else { 
			alert("Please select one row !");
		}
		if(ids == null) { 
			ids=0; 
			if(jQuery("#gridip").jqGrid('getGridParam','records') >0 ) { 
				jQuery("#gridip").jqGrid('setGridParam',{url:"db.php?q=2&id="+ids,page:1}); 
				jQuery("#gridip").jqGrid('setCaption',"Detail: "+ids) .trigger('reloadGrid'); 
			} 
		} 
		else { 
			ids=ret.DIP;
			var ip=ret.IP;
			var style=2;
			jQuery("#gridip").jqGrid('setGridParam',{url:"db.php?q=2&sip_mask="+ip+"&style="+style,page:1}); 
			jQuery("#gridip").jqGrid('setCaption',"IP History: "+ip) .trigger('reloadGrid'); 
		} 
	}
});
jQuery("#grid").jqGrid('navGrid','#pgrid',{del:false,add:false,edit:false},{height:150,reloadAfterSubmit:false},{height:150,reloadAfterSubmit:false},{reloadAfterSubmit:false},{multipleSearch:true}); 



jQuery("#gridip").jqGrid({        
	datatype: "json",
	height: 200,
	colNames:['ID','IP','PORT','CODE','HEADER','TIME','CONTENT','SOURCE','TABLE'],
	colModel:[
	{name:'ID',index:'ID', width:10,hidden:true},
	{name:'IP',index:'IP', width:100},
	{name:'PORT',index:'PORT', width:75},
	{name:'CODE',index:'CODE', width:75},
	{name:'HEADER',index:'HEADER', width:100},
	{name:'TIME',index:'TIME', width:100,hidden:false},
	{name:'CONTENT',index:'CONTENT', width:100},
	{name:'SOURCE',index:'SOURCE', width:150},
	{name:'TABLE',index:'TABLE', width:10,hidden:true}
	],
	width:800,
	rowNum:20,
	rowList:[10,20,30],
	mtype: "POST",
	pager: jQuery('#pgridip'),
	sortname: 'ID',
	viewrecords: true,
	sortorder: "desc",
	viewrecords: true,
	gridComplete: function(){
		var ids = jQuery("#gridip").jqGrid('getDataIDs');
		for(var i=0;i < ids.length;i++){
			var cl = ids[i];
			ae = "<input style='height:22px;width:100px;' type='button' onclick=\"showContent1(+"+cl+")\" value='Show CONTENT'/>"; 
			be = "<input style='height:22px;width:150px;' type='button' onclick=\"showSource1(+"+cl+")\" value='Show HTML Source'/>";
			jQuery("#gridip").jqGrid('setRowData',ids[i],{CONTENT:ae,SOURCE:be});
		}	
	}

});
jQuery("#gridip").jqGrid('navGrid','#pgridip',{del:false,add:false,edit:false},{height:150,reloadAfterSubmit:false},{height:150,reloadAfterSubmit:false},{reloadAfterSubmit:false},{multipleSearch:true}); 


//functions 
var flAuto = false;
var timeoutHnd;
 function doSearch(ev)
 { 

 	if(!flAuto) 
 		return; 
 // var elem = ev.target||ev.srcElement; 
   if(timeoutHnd) clearTimeout(timeoutHnd);
 	timeoutHnd = setTimeout(simpleSearch,500);
 }
function simpleSearch()
{
 
    var style=0
    $( "#from1" ).datepicker( "option", "dateFormat", "yy-mm-dd");
   	var from_mask = jQuery("#from1").val();
   	var sip_mask = jQuery("#sip").val();
   	if(from_mask==""){
   		alert("Must Select a Date!");
   	}
   	else{
   	jQuery("#grid").jqGrid('setGridParam',{url:"db.php?q=1&from_mask="+from_mask+"&sip_mask="+sip_mask+"&style="+style,page:1}); 
   	jQuery("#grid").jqGrid('setCaption',"Detail: ") .trigger('reloadGrid');
   }
}

function enableAutosubmit(state)
{ 
	flAuto = state; 
	jQuery("#simpleButton").attr("disabled",state);
}

function getMailDetail(cl)
{
	var ret = jQuery("#grid").jqGrid('getRowData',cl);
	var subject=ret.SUBJECT;
	var content=ret.CONTENT;
	var attachment=ret.ATTACHMENT;
	jQuery("#subject").attr("value",subject);
	$( "#content1" ).dialog({
		title: '邮件主题',
		width:200,  
		height:300,  
		modal:true
	});

}

function showContent(cl)
{
	var ret = jQuery("#grid").jqGrid('getRowData',cl);
	var ip=ret.IP;
	var tb=ret.TABLE;
	var style=1;
	
	jQuery.getJSON("db.php?&style="+style+"&from_mask="+tb+"&sip_mask="+ip, null, function(data) {
		//alert(data);
		//$('#ctest').contents().find('body').html(data);
		//$("#dialog").append($("<iframe />").attr("src", "your link")).
        $( "#container" ).append($("<iframe width='800' height='600'/></iframe>").attr("src", data)).dialog({
			title: 'Html Page',
			width:800,  
			height:600,  
			modal:true,
			close: function( event, ui ) {$( "#container").empty();}
		});
	});
}

function showContent1(cl)
{
	var ret = jQuery("#gridip").jqGrid('getRowData',cl);
	var ip=ret.IP;
	var tb=ret.TABLE;
	var style=1;
	jQuery.getJSON("db.php?&style="+style+"&from_mask="+tb+"&sip_mask="+ip, null, function(data) {
        $( "#container" ).append($("<iframe width='800' height='600'/></iframe>").attr("src", data)).dialog({
			title: 'Html Page',
			width:800,  
			height:600,  
			modal:true,
			close: function( event, ui ) {$( "#container").empty();}
		});
	});

}

function showSource(cl)
{
	var ret = jQuery("#grid").jqGrid('getRowData',cl);
	var ip=ret.IP;
	var tb=ret.TABLE;
	var style=1;
	
	jQuery.getJSON("db.php?&style="+style+"&from_mask="+tb+"&sip_mask="+ip+"&code=1", null, function(data) {
		//alert(data);
		//$('#ctest').contents().find('body').html(data);
		//$("#dialog").append($("<iframe />").attr("src", "your link")).
        $( "#container" ).text(data).dialog({
			title: 'Html Page',
			width:800,  
			height:600,  
			modal:true,
			close: function( event, ui ) {$( "#container").empty();}
		});
	});
}

function showSource1(cl)
{
	var ret = jQuery("#gridip").jqGrid('getRowData',cl);
	var ip=ret.IP;
	var tb=ret.TABLE;
	var style=1;
	jQuery.getJSON("db.php?&style="+style+"&from_mask="+tb+"&sip_mask="+ip+"&code=1", null, function(data) {
        $( "#container" ).text(data).dialog({
			title: 'Html Page',
			width:800,  
			height:600,  
			modal:true,
			close: function( event, ui ) {$( "#container").empty();}
		});
	});
}


function getAccessDetail(cl)
{
	var ret = jQuery("#gridip").jqGrid('getRowData',cl);
	var rev=ret.RECEIVER;
	var date=ret.DATE;
	var type=ret.TYPE;
	var style=2;
	var number = Math.random();
	$( "#container" ).dialog({
		title: '访问详情',
		width:800,  
		height:600,  
		modal:true
	});

// create the chart

jQuery.getJSON('db.php?number='+number+"&style="+style+"&from_mask="+date+"&rev_mask="+rev+"&type_mask="+type, null, function(data) {

	var chart = new Highcharts.StockChart({
		chart : {
			renderTo : 'container'
		},

		title: {
			text: ' by minute'
		},

		rangeSelector : {
			buttons : [{
				type : 'second',
				count : 1,
				text : '1s'
			}],
			selected : 1,
			inputEnabled : false
		},

		series : [{
			name : '访问次数',
			data : data,
			tooltip: {
				valueDecimals: 2
			}
		}]
	});           

});

}

function getHistoryDetail(cl)
{
	var ret = jQuery("#gridip").jqGrid('getRowData',cl);
	var rev=ret.RECEIVER;
	var date=ret.DATE;
	var type=ret.TYPE;
	var style=3;
	var number = Math.random();
	$( "#from" ).datepicker( "option", "dateFormat", "yy-mm-dd");
	$( "#to" ).datepicker( "option", "dateFormat", "yy-mm-dd");
	var from_mask = jQuery("#from").val();
	var to_mask = jQuery("#to").val();
	var strs= new Array();
	strs=date.split("-");
	var year=parseInt(strs[0],10);
	var month=parseInt(strs[1],10)-1;
	var day=parseInt(strs[2],10);

	$( "#container" ).dialog({
		title: '访问详情',
		width:800,  
		height:600,  
		modal:true
	});

// create the chart

jQuery.getJSON('db.php?number='+number+"&style="+style+"&from_mask="+date+"&rev_mask="+rev+"&type="+type, null, function(data) {

	var chart = new Highcharts.StockChart({
		chart : {
			renderTo : 'container'
		},

		title: {
			text: ' by day'
		},

		rangeSelector : {
			buttons : [{
				type : 'day',
				count : 1,
				text : '1D'
			}],
			selected : 1,
			inputEnabled : false
		},

		series : [{
			name : '访问次数',
			data : data,
			tooltip: {
				valueDecimals: 2
			}
		}]
	});           

});

}




